<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jsp/jstl/core">
    <ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                    template="./AdminTemplate.xhtml">

        <ui:define name="Title">
            <title>Employee Manager</title>
        </ui:define>

        <ui:define name="content">
            <h:form>
                <div id="content" style="font-size: 0.8em">
                    <p:dataTable rendered="#{adminVihicleBean.emp.position==1}" id="datatable" value="#{adminVihicleBean.listem}" var="em">
                        <p:column id="usernameColumn" headerText="UserName">
                            <h:outputText value="#{em.userName}"/>
                        </p:column>
                        <p:column id="passwordColumn" headerText="Password">
                            <h:outputText value="#{em.password}"/>
                        </p:column>
                        <p:column id="fullnameColumn" headerText="Full Name">
                            <h:outputText value="#{em.fullName}"/>
                        </p:column>
                        <p:column id="phoneColumn" headerText="Phone">
                            <h:outputText value="#{em.phone}"/>
                        </p:column>
                        <p:column id="emailColumn" headerText="Email">
                            <h:outputText value="#{em.email}"/>
                        </p:column>
                        <p:column id="addressColumn" headerText="Address">
                            <h:outputText value="#{em.address}"/>
                        </p:column>
                        <p:column id="brandIDColumn" headerText="BrandID">
                            <h:outputText value="#{em.brandID}"/>
                        </p:column>
                        <p:column id="positionColumn" headerText="Postion">
                           <h:outputLabel value="Admin" rendered="#{em.position==1}" />
                           <h:outputLabel value="Employee" rendered="#{em.position==2}" />
                        </p:column>

                        <p:column id="editColumn" headerText="Edit">
                            <h:commandLink value="Edit" action="#{adminVihicleBean.editEmployee(em)}"/>
                        </p:column>
                        <p:column id="deleteColumn" headerText="Delete">
                            <h:commandLink id="delete" action="#{adminVihicleBean.deleteEmployee(em.userName)}" >
                                <p:graphicImage value="./images/delete-red2.png" style="width: 30px; height: 30px" />
                            </h:commandLink>
                        </p:column>
                        <f:facet name="footer">
                            <p:outputPanel style="float: right;" >
                                <h:commandButton  value="Add new employee" action="#{adminVihicleBean.addEmployee}"/>
                            </p:outputPanel>
                        </f:facet>
                    </p:dataTable>


                    <h:form rendered="#{adminVihicleBean.emp.position==2}">
                        <div class="grid_2">
                            <div class="da-panel collapsible">
                                <div class="da-panel-header">
                                    <span class="da-panel-title">
                                        <img src="images/icons/color/blog.png"/>
                                        Employees Manage
                                    </span>

                                    <span class="da-panel-toggler"></span></div>
                                <div class="da-panel-toolbar top">
                                    <ul>
                                        <h:form>
                                            <li>
                                                <h:commandLink >
                                                    <img src="images/icons/color/pencil.png"/>Update
                                                </h:commandLink>
                                            </li>
                                        </h:form>
                                    </ul>
                                </div>
                                <div class="da-panel-content">
                                    <c:set value="#{adminVihicleBean.emp}" var="e"/>

                                    <table class="da-table da-detail-view">
                                        <tbody>
                                            <tr class="odd">
                                                <th>UserName</th>
                                                <td>#{e.userName}</td>
                                            </tr>
                                            <tr class="even">
                                                <th>FullName</th>
                                                <td>#{e.fullName}</td>
                                            </tr>
                                            <tr class="even">
                                                <th>Phone</th>
                                                <td>#{e.phone}</td>
                                            </tr>
                                            <tr class="odd">
                                                <th>Email</th>
                                                <td>#{e.email}</td>
                                            </tr>

                                            <tr class="odd">
                                                <th>Address</th>
                                                <td>#{e.address}</td>
                                            </tr>

                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </h:form>
                </div>
            </h:form>
        </ui:define>

    </ui:composition>
</html>